import { useCallback, useEffect, useState } from 'react';

export const useHash = () => {
  const [hash, setHash] = useState('');

  const hashChangeHandler = useCallback(() => {
    console.log('hash changed');
    setHash(window.location.hash);
  }, []);

  useEffect(() => {
    setHash(window.location.hash);
    window.addEventListener('hashchange', hashChangeHandler);
    return () => {
      window.removeEventListener('hashchange', hashChangeHandler);
    };
  }, [hashChangeHandler]);

  return hash;
};
